import React from "react";
import './Todo.css';
import TodoFooter from "../TodoFooter/TodoFooter";
import TodoHeader from "../TodoHeader/TodoHeader";
import TodoMain from "../TodoMain/TodoMain";
import { useEffect } from "react";
import store from "../../../redux/store";
import { asyncAddTodoAction, asyncCheckTodoAction, asyncGetTodosAction } from "../../../redux/reducers/todoReducer";
export default function Todo() {
  useEffect(() => {
    store.dispatch(asyncGetTodosAction());
    //测试异步新增
    // store.dispatch(asyncAddTodoAction('abc'));
    //测试更新
    // store.dispatch(asyncCheckTodoAction(10, true));
  }, [])

  return (
    <div className="todo-container">
      <div className="todo-wrap">
        <TodoHeader  />
        <TodoMain  />
        <TodoFooter  />
      </div>
    </div>
  );
}
